import React, { Component } from 'react';
import { Swiper  } from 'antd-mobile'
import * as axios from '../api/index'
import '../styles/Swipe.scss'

class Swipe extends Component {
    constructor(props){
        super(props)
        this.state={
            Swiperlist:[{img:'https://img0.baidu.com/it/u=1970496065,2381740362&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=300'},{img:'https://img.zcool.cn/community/013e175febd6a511013ee04d4e63e5.jpg@2o.jpg'},{img:'https://img2.baidu.com/it/u=3233525071,2236087654&fm=253&fmt=auto&app=138&f=JPEG?w=640&h=270'},{img:'https://img.zcool.cn/community/010cc25fbb27ba11013ee04df6cd84.jpg@1280w_1l_2o_100sh.jpg'}]
        }
    }
  async  componentDidMount(){
    //   var res = await  axios.banner_list()
    //   this.setState({Swiperlist:res.data.data})
    }
    render() {
        return (
            <div className='swiper' >
                <Swiper autoplay loop autoplayInterval={2000}>
                   {
                       this.state.Swiperlist.map((item, index) => {
                            return (
                                <Swiper.Item key={index}>    
                                      <img src={item.img} alt="" /> 
                                </Swiper.Item>
                            )
                        })
                    }
                </Swiper>
            </div>
        );
    }
}

export default Swipe;